body {
  padding-top: 50px;
}
/*.starter-template {
  padding: 40px 15px;
  text-align: center;
}*/
.res-index{
	.panel{
		margin-top: 20px;
		.list-group-item:hover{
			background-color:#f5f5f5;
			a{
				width: 100%;
				display: block;
			}
		}
	}
}
.container{
	.res-bread-nav{
		margin-top: 20px;
	}	
}
.res-list{
	.glyphicon-minus,.glyphicon-plus{
		float: right;
	}
	.panel-search{
		background-color: #f5f5f5;
	    margin:0 20px;
	    border-radius: 5px;
	    margin-top: 20px;
	    .form-group{
	    	overflow: hidden;
	    	label{
		    	text-align: right;
		    	line-height: 34px;
		    	height: 34px;
		    }
		    button{
		    	width: 100px;
		    }
	    }
	    
	}
	.table-lists{
		table-layout: fixed;
		thead{
			tr{
				th{
					text-align: center;
				}
			}
		}
		tbody{
			tr{
				td{
					word-wrap:break-word;
					cursor: pointer;
					text-align: center;
					.imgWrap{
						cursor: pointer;
						width: 150px;
					    display: block;
					    height: 150px;
					    padding: 5px;
					    background-color: #eee;
					    margin: 0 auto;
					    span{
				    	    width: 100%;
						    display: block;
						    height: 100%;
					    }
					}
					p{
						margin: 5px 0;
					}
				}
				.errorIndex{
					color:red;
					font-size: 20px;
				}
				.correctIndex{
					color:green;
					font-size: 20px;
				}
			}
		}
	}
}
.res-detail{
	.glyphicon-minus,.glyphicon-plus{
		float: right;
	}
	.track-list{
		.faceNum{color: #f00;}
		.panel-body{
			display:flex;
			display:-webkit-flex;
			flex-flow: row wrap;
			-webkit-flex-flow: row wrap;
			justify-content:space-around;
			-webkit-justify-content:space-around;
			.itemWarn{
				border: 1px solid red;
				box-shadow: 0 0 2px #f00;
				-webkit-box-shadow: 0 0 2px #f00;
			}
			.imgWrap{
				flex-grow:1;
				display:block;
				width:200px;
				height:200px;
				background-color:#eee;
				margin:5px;
				padding:10px;
				overflow:hidden;
				text-align:center;
				span{
					display:block;
					height:100%;
					width:100%;
				}

			}
			p{
				word-wrap:break-word;
				margin:5px;
				text-align: center;
			}
			.tooltip.left .tooltip-arrow{
				border-left-color: #ccc;
			}
			.tooltip.right .tooltip-arrow{
				border-right-color: #ccc;
			}
			.tooltip{
				.tooltip-inner{
					word-wrap:break-word;
					padding: 0px;
					font-size: 14px;
					max-width: 300px;

					pre{
						text-align: left;
					}
				}
			} 
			
		}
	}
}

@keyframes redshow{
	0%{
		box-shadow: 0 0 10px #f00;
		-webkit-box-shadow: 0 0 10px #f00;
	}
	25%{
		box-shadow: 0 0 1px #f00;
		-webkit-box-shadow: 0 0 1px #f00;	
	}
	50%{
		box-shadow: 0 0 10px #f00;
		-webkit-box-shadow: 0 0 10px #f00;
	}
	75%{
		box-shadow: 0 0 1px #f00;
		-webkit-box-shadow: 0 0 1px #f00;
	}
	100%{
		box-shadow: 0 0 10px #f00;
		-webkit-box-shadow: 0 0 10px #f00;
	}
}